<template>
  <div>
    <div class="loans" v-for="(item, index) in lists" :key="index">
      <!-- 序号 -->
      <div class="loans-basic">
        <p>序号：</p>
        <div>{{ index + 1 }}</div>
      </div>

      <!-- 类型 -->
      <div class="loans-basic">
        <p>类型 ：</p>
        <div>{{ item.tsstatus === "1" ? "投诉" : "留言" }}</div>
      </div>

      <!-- 项目 -->
      <div class="loans-basic">
        <p>项目：</p>
        <div v-if="item.tsxm === '1'">服务质量</div>
        <div v-if="item.tsxm === '2'">服务态度</div>
        <div v-if="item.tsxm === '3'">收费问题</div>
        <div v-if="item.tsxm === '4'">其它</div>
      </div>

      <!-- 投诉对象 -->
      <div class="loans-basic">
        <p>投诉对象 ：</p>
        <div>{{ item.tsr }}</div>
      </div>

      <!-- 标题 -->
      <div class="loans-basic">
        <p>标题 ：</p>
        <div>{{ item.tstitle }}</div>
      </div>

      <!-- 投诉内容 -->
      <div class="loans-basic">
        <p>投诉内容 ：</p>
        <div>{{ item.remark }}</div>
      </div>

      <!-- 状态 -->
      <div class="loans-basic">
        <p>状态 ：</p>
        <div>{{ item.status === "1" ? "未处理" : "已处理" }}</div>
      </div>

      <!-- 处理结果 -->
      <div class="loans-basic">
        <p>处理结果 ：</p>
        <div>
          {{ item.remarkr === null ? "正在处理中" : `${item.remarkr}` }}
        </div>
      </div>
      <div
        @click="cancelComplains(item.id)"
        v-if="item.status == '1'"
        class="loans-btn"
      >
        取消投诉
      </div>
    </div>
  </div>
</template>

<script>
import { resultsQuery, CancelComplain } from "../../../assets/js/api/user";
import { Toast, Dialog } from "vant";
export default {
  naem: "Result",
  data() {
    return {
      // state：1：未处理，2：已处理
      lists: []
    };
  },
  created() {
    resultsQuery().then(res => {
      if (res.code == 0) {
        this.lists = res.data;
        console.log(res);
      }
    });
  },
  methods: {
    cancelComplains(id) {
      Dialog.confirm({
        message: "确认取消"
      })
        .then(() => {
          // on confirm
          CancelComplain(id).then(res => {
            // console.log(res);
            if (res.code == 0) {
              Toast.success("取消成功");
              this.lists = [];
              resultsQuery().then(res => {
                if (res.code == 0) {
                  this.lists = res.data;
                }
              });
            }
          });
        })
        .catch(() => {
          // on cancel
        });
    }
  },
  components: {
    [Dialog.Component.name]: Dialog.Component
  }
};
</script>

<style></style>
